National Center for Supercomputing Applications
A Beginner's Guide to HTML

A Longer Example

Here is a longer example of an HTML document: 

    <HEAD>
    <TITLE>A Longer Example</TITLE>
    </HEAD>
    <BODY>
    <H1>A Longer Example</H1>
    This is a simple HTML document. This is the first
    paragraph. <P>
    This is the second paragraph, which shows special effects.  This is a 
    word in <I>italics</I>.  This is a word in <B>bold</B>.
    Here is an in-lined GIF image: <IMG SRC = "myimage.gif">. 
    <P>
    This is the third paragraph, which demonstrates links.  Here is 
    a hypertext link from the word <A HREF = "subdir/myfile.html">foo</A>
    to a document called "subdir/myfile.html". (If you 
    try to follow this link, you will get an error screen.) <P> 
    <H2>A second-level header</H2>
    Here is a section of text that should display as a 
    fixed-width font: <P>
    <PRE>
        On the stiff twig up there
        Hunches a wet black rook
        Arranging and rearranging its feathers in the rain ...
    </PRE>
    This is a unordered list with two items: <P>
    <UL>
    <LI> cranberries
    <LI> blueberries
    </UL>
    This is the end of my example document.<P>
    <ADDRESS>Me (me@mycomputer.univ.edu)</ADDRESS>
    </BODY>

Click here to see the formatted version.

[Excluding the GIF image, here's what it might look like on a typical browser: --ma]
______

A Longer Example

This is a simple HTML document. This is the first paragraph. 

This is the second paragraph, which shows special effects. This is a word in italics . This is a word in bold. Here is an in-lined GIF image: []

This is the third paragraph, which demonstrates links. Here is a hypertext link from the word foo to a document called "subdir/myfile.html". (If you try to follow this link, you will get an error screen.) 

A second-level header
Here is a section of text that should display as a fixed-width font: 

        On the stiff twig up there
        Hunches a wet black rook
        Arranging and rearranging its feathers in the rain ...
    This is a unordered list with two items: 

• cranberries 
• blueberries 
This is the end of my example document. 

Me (me@mycomputer.univ.edu)
______

In addition to tags already discussed, this example also uses the <HEAD> ... </HEAD> and <BODY> ... </BODY> tags, which separate the document into introductory information about the document and the main text of the document. These tags don't change the appearance of the formatted document at all, but are useful for several purposes (for example, NCSA Mosaic for Macintosh 2.0, for example, allows you to browse just the header portion of document before deciding whether to download the rest), and it is recommended that you use these tags.  

back to Troubleshooting
on to For More Information
return to Beginner's Guide  Contents.